<template>
  <div class="box">
    <div class="head">
      <van-icon class="arrow-left" name="arrow-left" @click="goBack" />
      <p class="title">购物车</p>
    </div>
    
    <WantsVue></WantsVue>
    <FooterVue class="footer"></FooterVue>
  </div>
</template>

<script>
import FooterVue from "@/components/Footer.vue";
import WantsVue from '@/components/ShoppingCar/Wants.vue';
export default {
  name: "ShoppingCar",

  components: {
    FooterVue,WantsVue
  },
  methods:{
   goBack(){
    this.$router.back()
   }
  }
   
};
</script>

<style scoped>
/* .box {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
} */

.head {
  height: 45px;
  background-color:skyblue;
  text-align: center;
  line-height: 45px;
}
.arrow-left {
  float: left;
  margin: 1rem;
  color: blue;
}
p{
  text-align: center;
  margin-right: 42px;
}
</style>
